<template>
  <div class="bg-w">
    <div class="box flex-al container">
      <!-- <build-el-bread></build-el-bread> -->
      <div class="w100">
        <build-el-h1 name="大赛详情-标题.png"></build-el-h1>
      </div>
      <img
        style="max-width: 100%; margin-bottom: 20px"
        v-if="details.contestFileId == 1"
        :src="details.contestVideoUrl"
        alt
      />
      <build-el-video
        v-else
        :src="details.contestVideoUrl"
        :poster="home.data.poster"
      ></build-el-video>
      <p class="infom">{{ details.contestText }}</p>
      <div class="w100" v-margin-top="'30px'">
        <build-el-h1 name="大赛进度标题.png"></build-el-h1>
        <div class="fwb" v-html="details.contestSchedule"></div>
        <!-- <div class="flex-row">
            <div v-for="(item,index) in progress.data" :key="index+item.name" class="flex-row">
                <build-el-hexagon :name="item.name" :date="item.date"></build-el-hexagon>
                <div class="line-row" v-if="index!=progress.data.length-1"></div>
            </div>
        </div>-->
      </div>
      <div v-margin-top="'30px'"></div>
    </div>
  </div>
</template>
<script>
import buildElBread from "@/components/build-el-bread";
import buildElH1 from "@/components/build-el-h1";
import buildElVideo from "@/components/build-el-video";
import buildElHexagon from "@/components/build-el-hexagon";
import JSONData from "@/assets/JSON";
export default {
  components: {
    buildElBread,
    buildElH1,
    buildElVideo,
    buildElHexagon,
  },
  data() {
    return {
      ...JSONData,
      details: {},
    };
  },
  async mounted() {
    let res = await this.api.findDownloadFile({ customizeId: 2 });
    this.details = res;
    console.log(this.details);
  },
};
</script>
<style lang="less" scoped>
.infom {
  width: 100%;
  margin-top: 37px;
  font-size: 16px;
  color: #333333;
  letter-spacing: 0;
  line-height: 24px;
  display: block;
}
.line-row {
  width: 68px;
  margin: 0 30px;
  background: #f03a0a;
}
</style>
<style >
body {
  background: #fff;
}
</style>
